﻿@using Blog1._0.Areas.Admin.Models;
@{
    ViewBag.Title = "Index";
    Layout = "~/Areas/Admin/Views/Shared/_LayoutList.cshtml";
}
<div class="admin-main">
    <blockquote class="layui-elem-quote p10">
        <form id="formSearch" class="layui-form" action="">
            <div class="layui-form-item" style="margin-bottom:0px;">
                <div style="float:right;">
                    @Html.TopToolBarHtml(ViewData["ActionFormRightTop"])
                </div>
            </div>
        </form>
    </blockquote>
    <div class="layui-field-box">
        <table id="defaultTable" lay-filter="defaultruv"></table>
        <script type="text/html" id="bar">
            @Html.ToolBarHtml(ViewData["ActionList"])
        </script>
    </div>
</div>
<script>
    layui.use(['table', 'common', 'form'], function () {
        var table = layui.table,
            form = layui.form,
            common = layui.common;
        var $ = layui.$;
        var index = layer.load(1);//增加加载等待loading

        //表格
        table.render({
            id: 'defaultReload'
           , elem: '#defaultTable'
           , height: 'full-112' //高度最大化减去差值
           , url: '/Blog/ArticleType/List' //数据接口
           , page: false //开启分页
           , cols: [[ //表头
             { checkbox: true, fixed: true },
             { title: '序号', width: 80, fixed: 'left', type: 'numbers' }
             , { field: 'TypeName', title: '文章类型' }
             , { field: 'UserName', title: '创建者' }
             , { field: 'CRT_Time', title: '创建时间', sort: true, templet: '<div>{{showDate(d.CRT_Time)}}</div>' }
             , { field: '', title: '操作', toolbar: "#bar" }
           ]],
           done: function (res) {   //返回数据执行回调函数
               layer.close(index);    //返回数据关闭loading
           }
        });
        //服务器排序
        table.on('sort(defaultruv)', function (obj) {
            //尽管我们的 table 自带排序功能，但并没有请求服务端。
            //有些时候，你可能需要根据当前排序的字段，重新向服务端发送请求，如：
            table.reload('defaultReload', {
                initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。 layui 2.1.1 新增参数
              , where: { //请求参数
                  field: obj.field //排序字段
                , order: obj.type //排序方式
              }
            });
        });
        //add
        $('#btnAdd').on('click', function () {
            common.openTop({
                title: '文章类型添加', w: '600px', h: '200px', content: '/Blog/ArticleType/Add/'
            });
        });
        //监听工具条
        table.on('tool(defaultruv)', function (obj) {
            var data = obj.data;
            if (obj.event === 'detail') {
                common.openTop({
                    detail: true,
                    title: '文章类型详情', w: '568px', h: '250px', content: '/Blog/ArticleType/Detail/' + data.TypeID, clickOK: function (index) {
                        common.close(index);
                    }
                });
            } else if (obj.event === 'del') {
                layer.confirm('确定要删除吗？', function (index) {
                    $.ajax({
                        url: "/Blog/ArticleType/Delete",
                        type: "POST",
                        data: { "Id": data.TypeID },
                        dataType: "json",
                        success: function (data) {
                            if (data.state == "success") {
                                obj.del();//删除这一行
                                layer.close(index); //关闭弹框
                                common.msgSuccess("删除成功");
                            } else {
                                common.msgError("删除失败");
                            }
                        }
                    });
                });
            } else if (obj.event === 'edit') {
                common.openTop({
                    title: '文章类型编辑', w: '600px', h: '200px', content: '/Blog/ArticleType/Edit/' + data.TypeID
                });
            }
        });
    });
</script>

